<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
	
</head>
<body>
	<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 定制响应式 -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../../favicon.ico">

    <title>Starter Template for Bootstrap</title>

    <!-- Bootstrap core CSS -->
    <script type="text/javascript" src="<%=request.getContextPath() %>/js/jquery-1.8.2.min.js"></script>
    <link href="<%=request.getContextPath() %>/css/bootstrap.min.css" rel="stylesheet">
    <script src="<%=request.getContextPath() %>/js/bootstrap.min.js"></script>
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="http://cdn.bootcss.com/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <!-- <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script> -->
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="http://cdn.bootcss.com/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <!-- <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script> -->
    
     <script type="text/javascript">
    	
    </script>
  </head>
    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    
  <body>
  	<!-- 基本  table -->
  	<!-- 有边线  table-bordered -->
  	<!-- 间隔背景  table-striped -->
  	<!-- 紧凑  table-condensed -->
  	<font color="red">紧凑</font>
  	 <table class="table table-condensed" >
  	 	<thead>
  	 		<tr>
  	 			<th>国家</th>
  	 			<th>省</th>
  	 			<th>市</th>
  	 			<th>县</th>
  	 		</tr>
  	 	</thead>
  	 	<tbody>
  	 		<tr>
  	 			<td>中国</td>
  	 			<td>山西</td>
  	 			<td>运城</td>
  	 			<td>临猗</td>
  	 		</tr>
  	 		<tr>
  	 			<td>中国</td>
  	 			<td>山西</td>
  	 			<td>运城</td>
  	 			<td>临猗</td>
  	 		</tr>
  	 	</tbody>
  	 </table>
  	<font color="red">间隔背景</font>
  	 <table class="table table-striped">
  	 	<thead>
  	 		<tr>
  	 			<th>国家</th>
  	 			<th>省</th>
  	 			<th>市</th>
  	 			<th>县</th>
  	 		</tr>
  	 	</thead>
  	 	<tbody>
  	 		<tr>
  	 			<td>中国</td>
  	 			<td>山西</td>
  	 			<td>运城</td>
  	 			<td>临猗</td>
  	 		</tr>
  	 		<tr>
  	 			<td>中国</td>
  	 			<td>山西</td>
  	 			<td>运城</td>
  	 			<td>临猗</td>
  	 		</tr>
  	 	</tbody>
  	 </table>
  	<font color="red"> 基本</font>
	<table class="table">
  	 	<thead>
  	 		<tr>
  	 			<th>国家</th>
  	 			<th>省</th>
  	 			<th>市</th>
  	 			<th>县</th>
  	 		</tr>
  	 	</thead>
  	 	<tbody>
  	 		<tr>
  	 			<td>中国</td>
  	 			<td>山西</td>
  	 			<td>运城</td>
  	 			<td>临猗</td>
  	 		</tr>
  	 		<tr>
  	 			<td>中国</td>
  	 			<td>山西</td>
  	 			<td>运城</td>
  	 			<td>临猗</td>
  	 		</tr>
  	 	</tbody>
  	</table>
  	<font color="red">有边线</font>
  	<table class="table table-responsive table-bordered table-hover" >
  	 	<thead>
  	 		<tr>
  	 			<th>国家</th>
  	 			<th>省</th>
  	 			<th>市</th>
  	 			<th>县</th>
  	 		</tr>
  	 	</thead>
  	 	<tbody>
  	 		<!-- On rows -->
<tr class="active"><td>active</td></tr>
<tr class="success"><td>success</td></tr>
<tr class="warning"><td>warning</td>.</tr>
<tr class="danger"><td>danger</td></tr>
<tr class="info"><td>info</td></tr>

  	 		
  	 		<tr>
  	 			<td>中国</td>
  	 			<td>山西</td>
  	 			<td>运城</td>
  	 			<td>临猗</td>
  	 		</tr>
  	 		<tr>
  	 			<td>中国</td>
  	 			<td>山西</td>
  	 			<td>运城</td>
  	 			<td>临猗</td>
  	 		</tr>
  	 	</tbody>
  	</table>
  </body>
</html>